<!--
 * @Author: sdorein sdorein@163.com
 * @Date: 2024-08-02 17:46:00
 * @LastEditors: sdorein sdorein@163.com
 * @LastEditTime: 2024-08-02 18:02:53
 * @FilePath: \vite-ts-project\src\views\test.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<script setup lang="ts">
import { defineComponent, reactive, ref } from "vue";
let pageComponents: PageComponent[] = reactive([]);
pageComponents = [
  {
    component: "Top",
    text: "标题文字",
    type: "1-3",
    active: true,
    style: "captiontextsstyle",
  },
  {
    component: "Body",
    text: "标题文字",
    type: "1-3",
    active: true,
    style: "captiontextsstyle",
  },
];

interface PageComponent {
  component?: string;
  type: number | string;
  active?: boolean;
  style?: any;
  setStyle?: any;
  text?: string;
}
</script>
<template>
  <div>
    <h1>动态组件测试</h1>
    <component v-for="(item, idx) in pageComponents" :is="item.component">
      <template v-slot:text> <div slot="text">11</div> </template>
    </component>
  </div>
</template>
